import React from 'react';
import Card from './card';
import './index.css';
import Nginx from './logo.svg';
import NginxIcon from './icon.svg';

import Ruby from './ruby.png';
import Mongo from './mongo.png';
import Node from './node.png';
import TomCat from './tomCat.png';
import Redis from './redis.png';
import Python from './python.png';
import AI from './AI.png';
import Java from './java.jpg';

const data = [
  {
    id: 0,
    logo: AI,
    title: '图文识别',
    des: (
      <div>
        <div>版本：v0.0.10</div>
        <div>标识id：asd55qweE54844asd</div>
      </div>
    ),     
    icon: AI,
    info: [
      '图文识别',
      '图文识别AI应用',
      'as5465465a4sSD4DSDSWD',
      'v0.0.10',
      'AI',
      'CETC15',
      'GTX 4080TI',
      '14',
      '28',
      'Python@2.7',
      '2018-04-24 18:00:00',
      '2019-04-24 18:00:00',
      'Arm64',
      'v0.0.10',
      '10',
    ]
  },
  {
    id: 1,
    logo: Nginx,
    title: '单点登录',
    des: (
      <div>
        <div>版本：v1.22.3</div>
        <div>标识id：asd55XXXeeeeeeee</div>
      </div>
    ),     
    icon: NginxIcon,
    info: [
      '单点登录',
      'cas单点登录系统',
      'dadsDSDSDSDSDSDSS44',
      'v0.0.23',
      '基础应用',
      'CETC15',
      'GTX 1080TI',
      '2',
      '4',
      'Java@17',
      '2018-04-24 18:00:00',
      '2019-04-24 18:00:00',
      'Windows',
      'v3.0.3',
      '10',
    ]
  },
  {
    id: 2,
    logo: Java,
    title: 'OCR',
    des: (
      <div>
        <div>版本：v1.2.3</div>
        <div>标识id：asd55qweE54844asd</div>
      </div>
    ),  
    icon: Java,
    info: [
      'OCR',
      'OCR识别系统',
      '11as5465465a4sSD4DSDSWD',
      'v0.0.10',
      'AI',
      'CETC15',
      'GTX 4090TI',
      '3',
      '6',
      'Python@2.7',
      '2018-04-24 18:00:00',
      '2019-04-24 18:00:00',
      'arm',
      'v0.0.10',
      '15',
    ]
  },
  // {
  //   id: 3,
  //   logo: Node,
  //   title: 'NodeJS',
  //   des: (
  //     <div>
  //       <div>版本：v1.2.3</div>
  //       <div>标识id：asd55qweE54844asd</div>
  //     </div>
  //   ),  
  //   icon: Node
  // },
  // {
  //   id: 4,
  //   logo: TomCat,
  //   title: 'TomCat',
  //   des: (
  //     <div>
  //       <div>版本：v1.2.3</div>
  //       <div>标识id：asd55qweE54844asd</div>
  //     </div>
  //   ),      
  //   icon: TomCat
  // },
  // {
  //   id: 5,
  //   logo: Redis,
  //   title: 'Redis',
  //   des: 'Redis x86 0.2天天更新',
  //   icon: Redis
  // },
  // {
  //   id: 6,
  //   logo: Python,
  //   title: 'Python',
  //   des: (
  //     <div>
  //       <div>版本：v1.2.3</div>
  //       <div>标识id：asd55qweE54844asd</div>
  //     </div>
  //   ),      
  //   icon: Python
  // },
];

export default function () {
  return (
    <div className="imagesBox">
      {
        data.map((i) => (
          <Card key={i.id} data={i} />
        ))
      }
    </div>
  );
}